<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <base href="<%=basePath%>">
    <link rel="stylesheet" href="static/component/pear/css/pear.css" />
    <link rel="stylesheet" href="static/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="static/css/public.css" media="all">
    <style type="text/css">
        .layui-table-cell {
            height: auto;
            line-height: 28px;
        }
    </style>
</head>
<body>


<div class="layuimini-container">
    <div class="layuimini-main">
        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane" >
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">商品名称</label>
                            <div class="layui-input-inline">
                                <input type="text" name="goodsName" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">单位</label>
                            <div class="layui-input-inline">
                                <select name="specifiCations"  class="layui-input specifiCations" lay-filter="relationship">
                                    <option value="全部">全部</option>
                                    <option value="瓶">瓶</option>
                                    <option value="箱">箱</option>
                                    <option value="个">个</option>
                                    <option value="盒">盒</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">品牌</label>
                            <div class="layui-input-inline">
                                <select name="brand"  class="layui-input pid">
                                    <option value="-1">全部</option>
                                    <c:forEach items="${listBrand}" var="listBrand">
                                        <option value="${listBrand.brandId}">${listBrand.brandName}</option>
                                    </c:forEach>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">一级分类</label>
                            <div class="layui-input-inline">
                                <select name="relationShipOne"  class="layui-input">
                                    <option value="-1">全部</option>
                                    <c:forEach items="${relationShipList}" var="relationShipList">
                                        <option value="${relationShipList.relationshipId}">${relationShipList.relationshipName}</option>
                                    </c:forEach>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button type="button" class="layui-btn layui-btn-primary"  lay-submit lay-filter="goodsFormSubmit"><i class="layui-icon"></i> 搜 索</button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>

        <script type="text/html" id="toolbarDemo">
            <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="add">
                <i class="layui-icon layui-icon-add-1"></i>
                新增
            </button>
            <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="plsj">
                <i class="layui-icon layui-icon-add-1"></i>
                批量上架
            </button>
            <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="spbh">
                <i class="layui-icon layui-icon-add-1"></i>
                商品补货
            </button>
            <%--<button class="pear-btn pear-btn-danger pear-btn-md" lay-event="batchRemove">
                <i class="layui-icon layui-icon-delete"></i>
                删除
            </button>--%>
        </script>

        <table class="layui-hide" id="goodsTableId" lay-filter="goodsTableFilter"></table>

        <script type="text/html" id="goodstolbar">
            <a class="layui-btn  layui-btn-normal layui-btn-sm "  lay-event="update"><i class="layui-icon layui-icon-edit">修改</i></a>
        </script>

    </div>
</div>

<script src="static/component/layui/layui.js"></script>
<script src="static/component/pear/pear.js"></script>
<script>
    //引入table
    layui.use(['table','form'],function () {
        var $ = layui.jquery;
        var from = layui.form;
        var table = layui.table;
        var form = layui.form;
        //执行表格的数据填充操作
        table.render({
            //指定渲染的表格
            elem: '#goodsTableId',
            //指定获取数据的路径
            url: 'goods/selectLikeGoods',
            toolbar: '#toolbarDemo',
            //规定请求方式
            method: 'post',
            //开启分页
            page: true,
            check: true,
            //指定每页显示数
            limits: [1, 10, 15],
            even: true,
            cols: [[
                {field: 'goodsId', title: '商品编号', align: 'center'},
                {field: 'goodsName', title: '商品名称', align: 'center'},
                {field: 'goodsPrice', title: '商品单价', align: 'center'},
                {field: 'brand', title: '品牌',templet: '#brand', align: 'center' },
                {field: 'goodsQuantity', title: '数量', align: 'center'},
                {field: 'relationShipOne', title: '一级分类',templet: '#relationshipOne', align: 'center'},
                {field: 'relationShipTwo', title: '二级分类', templet: '#relationshipTwo',align: 'center'},
                {field: 'capacity', title: '容量', templet: '#department', align: 'center'},
                {field: 'storgageRack', title: '所属货架',align: 'center',
                    templet:function (d){
                        if (d.storgageRack!=null){
                            return  d.storgageRack.storgageRackName;
                        }else{
                            return  "";
                        }
                    }

                },
                {field: 'specifiCations', title: '单位', align: 'center'},
                {field: 'goodsImg', title: '商品图', align: 'center',
                    templet: function (d) {
                        var img = "<img src='"+d.goodsImg+"'>";
                        return img;
                    }
                },
                {field: 'goodsState', title: '商品状态', align: 'center',
                    templet: function (d) {
                        var state = "";
                        if (d.goodsState == "在售") {
                            state = "<input type='checkbox'   value='" + d.goodsId + "' id='goodsState' lay-filter='goodsState' checked='checked' name='status'  lay-skin='switch' lay-text='在售|下架' value='在售' >";
                        }
                        else {
                            state = "<input type='checkbox' value='" + d.goodsId + "' id='goodsState' lay-filter='goodsState'  name='status'  lay-skin='switch' lay-text='在售|下架' >";
                        }
                        return state;
                    }

                },
                {field: 'createTime', title: '创建时间', align: 'center'},
                {title: '操作', align: 'center',templet: "#goodstolbar"}
            ]]
        })
        //表格事件
        table.on("toolbar(goodsTableFilter)",function (obj){
           if (obj.event==="add"){
              //打开添加页面
               //添加商品信息
               layer.open({
                   //执行修改用户操作
                   title:'添加商品信息',
                   type:2,
                   shade: 0.1,
                   area:['28%','75%'],
                   content: '/goods/skipAddGoods'
               })
           }else if(obj.event==="plsj"){
               layer.open({
                   //执行修改用户操作
                   title:'批量上架申请单',
                   type:2,
                   shade: 0.1,
                   area:['100%','100%'],
                   content: '/shelfapplication/skipAddShelfApplications'
               })
           }else if(obj.event==="spbh"){
               //商品补货
               layer.open({
                   //执行修改用户操作
                   title:'补货申请单',
                   type:2,
                   shade: 0.1,
                   area:['100%','100%'],
                   content: '/shelfapplication/skipreplenishments'
               })
           }
        })

        //修改
        table.on("tool(goodsTableFilter)",function (obj){
            if (obj.event==="update"){
                layer.open({
                    //执行修改商品
                    title:'修改商品信息',
                    type:2,
                    shade: 0.1,
                    area:['28%','75%'],
                    content: '/goods/skipUpdateGoods?goodsId='+obj.data.goodsId
                })
            }
        })


        //表单提交事件
        form.on("submit(goodsFormSubmit)",function(data){
            //执行搜索重载
            table.reload('goodsTableId',{
                //规定默认第几页
                page:{
                    curr:1
                },
                where:{
                    //添加请求参数
                    goodsName:data.field.goodsName,
                    specifiCations:data.field.specifiCations,
                    brand:data.field.brand,
                    relationShipOne:data.field.relationShipOne
                }
            });
            return false;
        })



        //开关事件
        form.on('switch(goodsState)',function (data){
            //判断是上架还是下架
            //获取是否打开
            var checked = data.elem.checked;//判断开关状态
            if (checked===true){
              //上架
                data.elem.checked =false;
                form.render();
                //弹出申请单窗口
                layer.open({
                    //执行修改用户操作
                    title:'添加商品上架申请单',
                    type:2,
                    shade: 0.1,
                    area:['28%','75%'],
                    content: '/shelfapplication/skipShelfApplication?goodsId='+data.value
                })
            }else {

                //下架
                data.elem.checked =true;
                form.render();
                layer.confirm('真的要对该商品下架吗？',function(index){

                    //发送异步请求,腾出来货架的位置,对数量清0所在货架清空
                    $.post("goods/goodsOffTheShelf",{goodsId:data.value},function (result){
                        if (result.success){
                            layer.msg(result.msg,{icon:1,time:1000},function(){
                                window.close();
                                parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页
                                parent.parent.location.reload(); // 父页面刷新
                                parent.layui.table.reload("goodsTableId");
                            });
                        }
                    })
                })
            }






           /* //获取用户编号
            var eId = data.value;
            //获取是否打开
            var checked = data.elem.checked;//判断开关状态

            var checked1 = null;
            var eState = null;
            if (checked===true){
                data.elem.checked =false;
                checked1 = true;
                eState ="正常";
            }else{
                data.elem.checked =true;
                checked1 = false;
                eState="禁用";
            }
            form.render();
            //提示
            layer.confirm('确定要变为'+eState+"状态吗?",{icon:3},function (index){
                //发送异步请求将状态更改
                $.post('/user/updateOneUser',{eId:eId,eState:eState},function(result){
                    if (result.success){
                        if (result.msg==='自己'){
                            layer.msg('您无法对自身进行状态修改操作',{icon:2},function (){
                                layer.close(index);
                            })
                        }else{
                            layer.msg(result.msg,{icon:1,time:1},function (){
                                data.elem.checked =checked1;
                                form.render();
                                layer.close(index);
                            })
                        }
                    }
                })

            })*/
        })
    })
</script>
<script type="text/html" id="brand">
    {{d.brand.brandName}}
</script>
<script type="text/html" id="relationshipOne">
    {{d.relationShipOne.relationshipName}}
</script>
<script type="text/html" id="relationshipTwo">
    {{d.relationShipTwo.relationshipName}}
</script>


</body>
</html>